<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0,maximum-scale=1.0, user-scalable=no" />
    <title>利率选择</title>
    <link rel="stylesheet" href="main/css/loan-choosse.css" />
    <script src="/main/js/common.js"></script>
    <script src="/main/js/utils.js"></script>
  </head>

  <body>
    <div id="loan-choose">
      <h1 class="loan-choose__title">自定义</h1>
      <div class="loan-choose__input">
        <div class="__input-l">
          <input type="number" v-model="percent" class="__input-l__input" data-attr="percent" @input="handleInput" maxlength="6" />
          <span style="font-size: 14px; color: black">% X </span>
          <input type="number" v-model="multiple" class="__input-l__input" data-attr="multiple" @input="handleInput" maxlength="6" />
          <span>倍 = </span>
          <span style="min-width: 30px; display: inline-block; color: #666; font-size: 14px; max-width: 80px">{{ percent*multiple ? percent*multiple :"0.00"}}</span>
          <span>%</span>
        </div>
        <div class="__input-r">
          <van-button type="info" @click="handleRateChoose">确定</van-button>
        </div>
      </div>
      <h1 class="loan-choose__title">或选择贷款利率</h1>
      <ul class="loan-choose__list" @click="chooseAccumulationFundLoan">
        <li class="loan-choose__item" v-for="(item,index) in list" :data-loan="item.num" :class="{ IS_ACTIVE_COLOR: yetChooseLoan==item.num }">{{item.name}}</li>
      </ul>
    </div>
    <script src="main/js/loan-choose.js"></script>
  </body>
</html>
